<template>
  <!-- 设置 router-view 的 key 属性值为 $route.path 
  从 /page/1 => /page/2, 由于这两个路由的 $route.path 并不一样, 所以组件被强制不复用。
相关钩子加载顺序为：beforeRouteUpdate => created => mounted

就是要重新调用钩子
-->
  <a-config-provider :locale="zhCN">
    <router-view :key="$route.path" />
  </a-config-provider>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import zhCN from 'ant-design-vue/es/locale/zh_CN';
import { ConfigProvider } from 'ant-design-vue';
import { useStore } from '@/store';

export default defineComponent({
  components: {
    [ConfigProvider.name]: ConfigProvider,
  },
  setup() {
    // vuex
    const store = useStore();

    return { zhCN };
  },
});
</script>

<style lang="scss" scoped></style>
